<!DOCTYPE html>
<html>
	<head>
	  <meta charset="utf-8">
	  <title>Layui</title>
	  <meta name="renderer" content="webkit">
	  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	  <link rel="stylesheet" href="layui/css/layui.css"  media="all">
	  
	  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
	</head>
	<body>
		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
			<legend>添加用户</legend>
		</fieldset>
		 
		<form class="layui-form" action="" lay-filter="example">
		  <div class="layui-form-item">
		    <label class="layui-form-label">用户名</label>
		    <div class="layui-input-block">
		      <input type="text" name="userName" lay-verify="title" autocomplete="off" placeholder="请输入用户名" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">密码</label>
		    <div class="layui-input-block">
		      <input type="password" name="passWord" lay-verify="pwd" placeholder="请输入密码" autocomplete="off" class="layui-input">
		    </div>
		  </div>
		  <div class="layui-form-item">
		    <label class="layui-form-label">权限</label>
		    <div class="layui-input-block">
		      <input type="text" name="authority" lay-verify="title" autocomplete="off" placeholder="请输入权限" class="layui-input">
		    </div>
		  </div>
		 <!-- <div class="layui-form-item">
		    <label class="layui-form-label">昵称</label>
		    <div class="layui-input-block">
		      <input type="text" name="personalName" lay-verify="title" autocomplete="off" placeholder="请输入昵称" class="layui-input">
		    </div>
		  </div> -->	
		  <div class="layui-form-item">
		    <label class="layui-form-label">课程等级</label>
		    <div class="layui-input-block">
		      <input type="text" name="courseVip" lay-verify="courseVip" autocomplete="off" placeholder="请输入课程等级(0->5)" class="layui-input">
		    </div>
		  </div>
		  
	
		 
		  <div class="layui-form-item">
		    <div class="layui-input-block">
				 <button type="reset" class="layui-btn layui-btn-primary">重置</button>
		      <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
		    </div>
		  </div>
		</form>
		
		<script src="layui/layui.js" charset="utf-8"></script>
		<!-- <script type="text/javascript" src="layui/js/jquery-1.8.3.min.js"></script> -->
		<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
		<script>
		layui.use(['form', 'layedit', 'laydate'], function(){
		  var form = layui.form
		  ,layer = layui.layer
		  ,$ = layui.jquery
		  ,layedit = layui.layedit
		  ,laydate = layui.laydate;
		  
		  //自定义验证规则
		    form.verify({
		      title: function(value){
		        if(value.length < 1){
		          return '此栏不能为空噢';
		        }
		      }
		      ,pwd: [
		        /^[\S]{6,12}$/
		        ,'密码必须6到12位，且不能出现空格'
		      ],courseVip: [
				/^([0-5]|5)$/
				,'课程等级设置只能为0-5'
			  ]
		      
		    });
		  
		  
		  //监听提交
		  form.on('submit(demo1)', function(data){
		    $.post({
		    	url: 'http://localhost:8083/admin/addUser',
		    	data: JSON.stringify(data.field),
		    	dataType:"json",
		    	timeout:300000,
				contentType: 'application/json; charset=UTF-8',
		    	success:function(result) {
		    			if(result) {
		    				layer.msg("添加成功",{time: 1000},function(){
		    					location.href="user_list.html";
		    				});
		    			}
		    	}
		    });
		    return false;
		  });
		 
		  
		  
		  //表单取值
		  layui.$('#LAY-component-form-getval').on('click', function(){
		    var data = form.val('example');
		    alert(JSON.stringify(data));
		  });
		  
		});
		</script>
		<style>
		
		.layui-input{
			width:35%
		}
		
		</style>
	</body>
</html>



